@charset "utf-8";
/* CSS Document */
p
{
	font-family:"Times New Roman", Times, serif;
}
body{
	height:100%;
	margin:0px; 
	padding:0px;
	background-color:#CCC;
}
#indexWrapper{
	position:relative;
	width:1000px;
	min-height:810px;
	margin-top:0px;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	background-color:#fff;
}
#header{
	position:absolute;
	width:1000px;
	height:100px;
	top:0px;
	background-image:url(../Image/header.png);
	border-radius: 10px 10px 0px 0px;
	text-align:right;
	padding:0px;
}
#header a{
	font-size:16px;
	font-weight:bold;
	color:#FFF;
	position:absolute;
	padding:12px;
	right:10px;
	bottom:0px;
	text-decoration:none;
}
#menu{
	position:absolute;
	width:1000px;
	height:40px;
	top:101px;
	background-color:#060;
}

#menu ul{
	margin:0px;
	padding:0px;
	line-height:40px; /* canh giữa theo chiều dọc */
	text-align:left;
	float:left;
	list-style:none;
}
#menu ul li{
	float:left;
	padding:0px 5px 0px 5px;
}

#menu ul li.quit{
	position:absolute;
	bottom:0px;
	right:0px;
}

#menu ul li a{
	text-decoration:none;
	text-align:center;
	color:#030;
	font-weight:bold;
	padding:6px 15px 6px 15px;
	
	border-radius:15px;
	-wekbit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	
	background: #9dd53a; /* Old browsers */
	background: -moz-linear-gradient(top, #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#9dd53a), color-stop(50%,#a1d54f), color-stop(51%,#80c217), color-stop(100%,#7cbc0a)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* IE10+ */
	background: linear-gradient(to bottom, #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* W3C */
}

#menu ul li a:hover{	
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);

	background: #c9de96; /* Old browsers */
	background: -moz-linear-gradient(top, #c9de96 0%, #8ab66b 44%, #398235 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#c9de96), color-stop(44%,#8ab66b), color-stop(100%,#398235)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #c9de96 0%,#8ab66b 44%,#398235 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #c9de96 0%,#8ab66b 44%,#398235 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #c9de96 0%,#8ab66b 44%,#398235 100%); /* IE10+ */
	background: linear-gradient(to bottom, #c9de96 0%,#8ab66b 44%,#398235 100%); /* W3C */
}

#menu ul li a.subMenu{
	text-decoration:none;
	text-align:center;
	color#030;
	font-weight:bold;
	padding:4px 12px 4px 12px;
	
	border-radius:15px;
	-wekbit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	
	background: #f2f6f8;
	background: -moz-linear-gradient(top, #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f2f6f8), color-stop(50%,#d8e1e7), color-stop(51%,#b5c6d0), color-stop(100%,#e0eff9));
	background: -webkit-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
	background: -o-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
	background: -ms-linear-gradient(top, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
	background: linear-gradient(to bottom, #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%);
}

#menu ul li a.subMenu:hover{	
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);

	background: #f5f6f6; /* Old browsers */
	background: -moz-linear-gradient(top, #f5f6f6 0%, #dbdce2 21%, #b8bac6 49%, #dddfe3 80%, #f5f6f6 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f6), color-stop(21%,#dbdce2), color-stop(49%,#b8bac6), color-stop(80%,#dddfe3), color-stop(100%,#f5f6f6)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* IE10+ */
	background: linear-gradient(to bottom, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* W3C */
}

#indexContent{
	position:absolute;
	width:100%;
	height:595px;
	top:140px;
}
#main{
	position:absolute;
	width:59%;
	height:99%;
	top:2px;
	left:0px;
}
#topLeft{
	position:absolute;
	width:49%;
	height:49%;
	top:2px;
	left:1px;
	background-color:#FFF;
	background-image:url(../Image/content_header.png);
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: 5px 3px 5px #ccc;
	-webkit-bot-shadow: 5px 3px 5px #ccc; /* chay tren chorme*/
	-moz-box-shadow: 5px 3px 5px #ccc; /* chay tren firefox */
	
}
#topRight{
	position:absolute;
	width:49%;
	height:49%;
	top:2px;
	right:0px;
	background-color:#FFF;
	background-image:url(../Image/content_header.png);
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: 5px 3px 5px #ccc;
	-webkit-bot-shadow: 5px 3px 5px #ccc; /* chay tren chrome */
	-moz-box-shadow: 5px 3px 5px #ccc; /* chay tren firefox */
}
#bottomLeft{
	position:absolute;
	width:49%;
	height:49%;
	bottom:0px;
	left:1px;
	background-color:#FFF;
	background-image:url(../Image/content_header.png);
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow:5px 3px 5px #ccc;
	-webkit-bot-shadow:5px 3px 5px #ccc; /* chay tren chrome */
	-moz-box-shadow:5px 3px 5px #ccc; /* chay tren firefox */
}
#bottomRight{
	position:absolute;
	width:49%;
	height:49%;
	bottom:0px;
	right:0px;
	background-color:#FFF;
	background-image:url(../Image/content_header.png);
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: 5px 3px 5px #ccc;
	-webkit-bot-shadow: 5px 3px 5px #ccc; /* chay tren chrome */
	-moz-box-shadow: 5px 3px 5px #ccc; /* chay tren firefox */
}

#notification{
	position:absolute;
	width:39%;
	height:98%;
	top:3px;
	right:7px;
	background-color:#FFF;
	background-image:url(../Image/content_header.png);
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: 5px 3px 5px #ccc;
	-webkit-bot-shadow: 5px 3px 5px #ccc; /* chay tren chrome */
	-moz-box-shadow: 5px 3px 5px #ccc; /* chay tren firefox */
}
#footer{
	position:absolute;
	width:100%;
	height:70px;
	bottom:0px;
	background-image:url(../Image/footer.png);
}
#footer p{
	position:absolute;
	color:#FFF;
	font-size:14px;
	text-align:left;
	margin-left:5px;
}
#wrapper{
	position:relative;
	width:1000px;
	/*height:650px;*/
	min-height:100%;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	background:#FFF;
	
}
#content{
	position:absolute;
	width:1000px;
	/*height:470px;*/
	
	top:140px;
	background:#FFF;
}
#loginForm{
	position:absolute;
	width:300px;
	height:200px;
	margin-top:25%;
	margin-left:34%;

	background-image:url(../Image/content_header.png);
	background-color:#006666;
	background-repeat:no-repeat;
	
	border-radius:15px;
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	
	box-shadow: 5px 3px 5px #ccc;
	-webkit-bot-shadow: 5px 3px 5px #ccc; /* chay tren opera */
	-moz-box-shadow: 5px 3px 5px #ccc; /* chay tren firefox */
}
#loginForm input{  /*reset lại các thuộc tính canh lề để không bị nhảy giao diện trên các loại trình duyêt khác nhau */
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
}
#loginForm input[type=text],
#loginForm input[type=password],
#loginForm input[type=submit] {	
	margin-top:5px;
	padding: 6px 15px;
	outline: none;

	font-family: Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	text-shadow: 0px 1px 1px rgba(255,255,255, .2);

	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
	
	transition: all .15s ease-in-out;
	-webkit-transition: all .15s ease-in-out;
	-moz-transition: all .15s ease-in-out;
	-o-transition: all .15s ease-in-out;
	
}
#loginForm input[type=text]{
	margin-top:10px;
}
#loginForm input[type=text],
#loginForm input[type=password]{
	color:#000;
	width: 170px;

	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6);

	background:#999;
	background:linear-gradient(top,  #ffffff 0%,#989898 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#989898));
	background:-webkit-linear-gradient(top,  #ffffff 0%,#989898 100%);
	background:-moz-linear-gradient(top,  #ffffff 0%, #989898 100%);
	background:-o-linear-gradient(top,  #ffffff 0%,#989898 100%);
	background:-ms-linear-gradient(top,  #ffffff 0%,#989898 100%);
}
#loginForm input[type=text]:hover,
#loginForm input[type=password]:hover {
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .6), 0px 0px 5px rgba(255,255,255, .5);
}
#loginForm input[type=text]:focus,
#loginForm input[type=password]:focus {
	background:#FFF;
	background: linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e1e1e1));
	background: -webkit-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
	background: -moz-linear-gradient(top,  #ffffff 0%, #e1e1e1 100%);
	background: -o-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
	background: -ms-linear-gradient(top,  #ffffff 0%,#e1e1e1 100%);
}
#loginForm input[type=submit]{
	cursor: pointer;
	color:#033;
	
	box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-webkit-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	-moz-box-shadow: inset 1px 1px 1px 0px rgba(255,255,255, .45), 0px 1px 1px 0px rgba(0,0,0, .3);
	
	background:#FFF;
	background: linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a5cd4e), color-stop(100%,#6b8f1a));
	background: -webkit-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
	background: -moz-linear-gradient(top,  #a5cd4e 0%, #6b8f1a 100%);
	background: -o-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
	background: -ms-linear-gradient(top,  #a5cd4e 0%,#6b8f1a 100%);
}
#loginForm input[type=submit]:hover {
	-webkit-box-shadow: inset 1px 1px 3px 0px rgba(255,255,255, .8), 0px 1px 1px 0px rgba(0,0,0, .6);
	-moz-box-shadow: inset 1px 1px 3px 0px rgba(255,255,255, .8), 0px 1px 1px 0px rgba(0,0,0, .6);
	box-shadow: inset 1px 1px 3px 0px rgba(255,255,255, .8), 0px 1px 1px 0px rgba(0,0,0, .6);
}
#loginForm input[type=submit]:active {
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	box-shadow: none;
}
#botBanner{
	position:absolute;
	width:1000px;
	height:40px;
	background-image:url(../Image/botBanner.png);
	top:200%;
}
.title{
	color:#CCC;
	font-size:20px;
	margin-top:10px;
}
.icon{
	height:100px;
	wight:100px;
	margin-top:30px;
}
.link{
	text-decoration:none;
	font-size:18px;
	color:#030;
}